<template>
  <div id="root">
    <button @click="getBooks">获取书书籍信息</button>
    <br/>
    <button @click="getComments">获取评价信息</button>
    <form action="#">
      请输入title<input v-model="info.title" type="text"><br>
      请输入view<input v-model="info.view" type="text"><br>
      <button @click.prevent="postInfo" type="button">提交</button>
    </form>
  </div>
</template>
<script>
import axios from 'axios'

export default {
  name: 'App',
  data() {
    return {
      info: {
        title: '',
        view: ''
      }

    }
  },
  methods: {
    
    getBooks: function () {
      axios({
        method: 'get',
        url: 'http://localhost:8081/db/posts'
      }).then(res => {
        console.log('请求成功了', res.data)
      }, error => {
        console.log('请求失败了', error.message)
      })
    },
    getComments: function () {
      axios({
        method: 'get',
        url: 'http://localhost:8081/db/comments'
      }).then(res => {
        console.log('请求成功了', res.data)
      }, error => {
        console.log('请求失败了', error.message)
      })
    },
    postInfo() {
      axios({
        method: 'post',
        url: 'http://localhost:8081/db/posts',
        data: {
          title: this.info.title,
          view: this.info.view,
        },
      }).then(res => {
            console.log(res.data)
          },
          error => {
            console.log(error.message)
          })
    }

  },
}
</script>